IOS 安全區域(規範)

A 顯示屏關鍵特性

解析度:375 x 812 點(對應 1125 x 2436 畫素,3x 影象縮放因子)。

相較4.7英寸裝置:375點寬度相同,高度多出145點(約20%的內容空間)。

形狀:顯示屏四角圓角設計,與裝置外形對稱。設計時避免內容被螢幕邊緣、感測器槽、底部的指示器遮擋。

橫屏檢視佔滿整個螢幕

在 iPhone 8 上,如果沒有狀態列,安全區域的尺寸和視口一樣大。如果狀態列可見,安全區域的上邊緣會降低以適應狀態列的高度。安全區域進一步內嵌以適應導航欄和工具欄或標籤欄。

iPhone X 上,在縱向模式下,即使螢幕上沒有狀態列,安全區域也會從螢幕的頂部和底部邊緣內嵌。這有助於防止介面元素被感測器外殼、顯示屏圓角和主螢幕指示器遮擋,確保應用介面在所有顯示區域中都能正常顯示。

在橫向模式下,安全區域會從螢幕的兩側和主螢幕指示器內嵌

B Custom Layout

在螢幕頂部或底部放置黑邊會使你的應用顯得小、擁擠,並且與 iPhone X 上的其他應用不一致

iPhone X 的螢幕比例與 4.7 英寸顯示屏不同。為 iPhone 8 的 16:9 比例設計的背景圖形,如果在 iPhone X 上填充,會在左右邊緣被裁剪,或者適應螢幕時會有黑邊。

任何靠近視口邊緣或角落的元素都可能被顯示屏的圓角裁剪或被感測器外殼遮擋,請確保內嵌控制元件和其他元素以避免這種情況。

基於裝置旋轉而變化的非對稱佈局會導致不一致的使用者體驗,並且可能削弱使用者建立肌肉記憶的能力。

不要放置可操作的控制元件或圖在指示器上。

上劃手勢:

使用者透過從螢幕底部上劃訪問應用切換器和 Home 螢幕。大多數情況下,上劃手勢發生在螢幕中心,不會與應用互動產生衝突。如果應用或遊戲要求使用者在螢幕底部上劃,建議開啟底部邊緣保護。

底部邊緣保護使指示器外觀更隱蔽,並需要兩次上劃才能退出應用。第一次上劃或拖動會提升指示器並啟用控制。第二次上劃允許使用者退出應用或遊戲。

點選底部邊緣:點選底部邊緣只會影響應用或遊戲本身。點選表格單元格與指示器無關。

滾動檢視:垂直滾動檢視(如表格或集合檢視)應延伸至顯示屏底部,而不是被安全區域限制。

啟用自動隱藏:在展示全屏視覺內容時,可以啟用自動隱藏功能。自動隱藏使指示器在螢幕幾秒未觸碰時淡出,再次觸碰時淡入。自動隱藏應僅用於使用者不太可能頻繁觸碰螢幕的被動體驗。